<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>查询统计</title>
    <script src="../../js/header.js"></script>
    <style type="text/css">
        html, body, #app {
            padding: 0px;
            margin: 0px;
        }

        #app {
            border-top: 3px solid #0D9AFF;
            padding: 25px;
        }

        .el-select, .el-date-editor.el-input, .el-date-editor.el-input__inner {
            width: 100%;
        }
    </style>
</head>

<body>
<div v-cloak id="app">
    <div style="margin-top: 10px; border-bottom:1px solid rgba(200,200,200,0.43);">
        <!--搜索栏-->
        <el-form :model="selectForm" ref="selectForm" label-width="150px">
            <el-row>
                <el-col :span="7">
                    <el-form-item label="项目名称:" prop="" label-width="120px">
                        <el-input v-model="selectForm.projectName" :maxlength=25 placeholder=""></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="经办人:" prop="" label-width="110px">
                        <el-input v-model="selectForm.createUser" placeholder="" :maxlength=25></el-input>
                    </el-form-item>
                </el-col>
                <el-col span="8">
                    <el-form-item label="办理机构:" prop="selectForm.createUserUnit" label-width="110px">
                        <el-select v-model="selectForm.createUserUnit" placeholder="">
                            <!-- <el-option
                                     v-for="item in orgs"
                                     :key="item.deptId"
                                     :label="item.deptName"
                                     :value="item.deptName">
                             </el-option>-->
                            <el-option style="height: auto">
                                <el-tree :data="orgs" show-checkbox
                                         :expand-on-click-node="false"
                                         check-on-click-node
                                         :default-expand-all="true"
                                         :check-strictly="true"
                                         node-key="id" ref="tree"
                                         highlight-current :props="defaultProps"
                                         @check-change="handleCheckChangeOnce">
                                </el-tree>
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col span="7">
                    <el-form-item label="行政区划:" prop="" label-width="120px">
                        <el-input v-model="selectForm.administrativeDivision" placeholder="" :maxlength=25></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="办理时间:" prop="" label-width="110px">
                        <el-date-picker
                                v-model="selectForm.startTime"
                                type="date"
                                :editable="false"
                                :clearable="false"
                                value-format="yyyy-MM-dd"
                                placeholder="开始时间"
                                style="width: 147px;"
                                @change="changeval()"
                        >
                        </el-date-picker>
                        <span style="color: rgb(192, 204, 218);text-align: center;">—</span>
                        <el-date-picker
                                v-model="selectForm.endTime"
                                type="date"
                                :editable="false"
                                :clearable="false"
                                value-format="yyyy-MM-dd"
                                placeholder="结束时间"
                                style="width: 147px;"
                                @change="changeval()"
                        >
                        </el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col span="8">
                    <el-form-item label="单位名称:" prop="" label-width="110px">
                        <el-input v-model="selectForm.unitName" placeholder="" :maxlength=25></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col span="7">
                    <el-form-item label="监管实体类别:" prop="" label-width="120px">
                        <el-select v-model="selectForm.supervisionType" placeholder="请选择">
                            <el-option label="检测环境" value="0"></el-option>
                            <el-option label="其他" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="状态:" prop="" label-width="110px">
                        <el-select v-model="selectForm.status" placeholder="请选择">
                            <el-option label="未提交" value="0"></el-option>
                            <el-option label="已提交" value="1"></el-option>
                            <el-option label="已撤回" value="2"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <div style="float: right;">
                    <el-button type="primary" size="small" style="width: 60px;height: 30px;"
                               @click="searchForm('selectForm')">查询
                    </el-button>
                    <el-button type="warning" size="small" style="width: 60px;height: 30px;"
                               @click="resetForm1('selectForm')">重置
                    </el-button>
                </div>
            </el-row>
        </el-form>
    </div>
    <!--分页表格-->
    <el-table :data="supervisionrecord" border style="width: 100%;margin-top: 35px;"
              :header-cell-style="{background:'#eef1f6',color:'#606266'}">
        <!--<el-table-column type="selection"></el-table-column>-->
        <el-table-column
                prop=""
                type="index"
                label="序号"
                width="100"
                align="center">
        </el-table-column>
        <el-table-column
                prop="createUser"
                label="经办人"
                width="200"
                align="center">
        </el-table-column>
        <el-table-column
                prop="createUserUnit"
                label="办理机构"
                width="200"
                align="center">
        </el-table-column>
        <el-table-column
                prop="submitTime"
                label="办理时间"
                width="200"
                align="center">
        </el-table-column>
        <el-table-column
                prop="unitName"
                label="单位名称 "
                width="180"
                align="center">
        </el-table-column>
        <el-table-column
                prop="supervisionType"
                label="监管实体类别"
                width="180"
                align="center">
            <template slot-scope="scope">
                <span v-if="scope.row.supervisionType==0">检测环境</span>
                <span v-if="scope.row.supervisionType==1">其他</span>
            </template>
        </el-table-column>
        <el-table-column
                prop="status"
                label="状态"
                width="180"
                align="center">
            <template slot-scope="scope">
                <span v-if="scope.row.status==0" style="color:#F19437;">未提交</span>
                <span v-if="scope.row.status==1" style="color:#20A0FF;">已提交</span>
                <span v-if="scope.row.status==2" style="color:#FF4949;">已撤回</span>
            </template>
        </el-table-column>
        <el-table-column
                label="操作"
                width=""
                align="center">
            <template slot-scope="scope">
				<span v-if="scope.row.status==1">
					<el-button size="mini" @click="view(scope.$index,scope.row)">查看</el-button>			
					<el-button type="success" size="mini" @click="cuiban(scope.$index,scope.row)">催办</el-button>
				</span>
            </template>
        </el-table-column>
    </el-table>
    <div style="overflow: hidden;">
        <div class="pagination">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-sizes="[10, 20, 30, 40]"
                    :page-size="pagesize"
                    background
                    layout="total, sizes,prev, pager, next"
                    :total="tableTotal"
                    prev-text="上一页"
                    next-text="下一页">
            </el-pagination>
            <el-button type="primary" size="mini" @click="tongji()" style="float: right;margin-left: 10px;">统计
            </el-button>
            <el-button type="primary" size="mini" @click="appovalEx()" style="float: right;">导出</el-button>
        </div>
    </div>

    <!--统计弹窗-->
    <el-dialog title="" :visible.sync="tjdialogForm" center fullscreen>
        <div style="margin-top: 0px;">
            <el-row>
                <el-col :span="4" class="tab-title">
                    统计信息
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="22">
                    <div id="echarts3" style="width: 100%;height:600px;"></div>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="22">
                    <div style="float:right;">
                        <el-button type="info" size="small" style="width: 60px;height: 30px;"
                                   @click="tjdialogForm = false">关闭
                        </el-button>
                    </div>
                </el-col>
            </el-row>
        </div>
    </el-dialog>

    <!--查看详情弹窗-->
    <el-dialog title="" :visible.sync="viewdialogForm" center fullscreen>
        <div style="margin-top: 0px;">
            <el-form :model="viewsupervisionrecord" ref="viewrecordProject" label-width="140px">
                <el-row>
                    <el-col :span="8" class="tab-title">
                        监管结果登记详情
                    </el-col>
                </el-row>
                <el-row>
                    <!--2020.7.17：新增以下两个字段-->
                    <el-col :span="11">
                        <el-form-item label="标题:" prop="title" label-width="140px">
                            <el-input v-model.trim="viewsupervisionrecord.title" placeholder="" disabled/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="监管对象名称:" prop="supervisionObjectName" label-width="140px">
                            <el-input v-model.trim="viewsupervisionrecord.supervisionObjectName" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="项目名称:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.projectName" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="建设位置:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.jianPlace" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="11">
                        <el-form-item label="单位名称:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.unitName" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="行政区划:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.administrativeDivision" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="工程类型:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.projectType" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="项目类型:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.itemType" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="联系人:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.linkman" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="联系电话:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.linkmanPhone" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="是否影响:" prop="" label-width="140px">
                            <el-select v-model="viewsupervisionrecord.isAffect " disabled>
                                <el-option label="是" value="0"></el-option>
                                <el-option label="否" value="1"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="是否办理行政许可:" prop="" label-width="140px">
                            <el-select v-model="viewsupervisionrecord.administrativeLicense " disabled>
                                <el-option label="已办理" value="0"></el-option>
                                <el-option label="未办理" value="1"></el-option>
                                <el-option label="无需办理" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="经办人:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.createUser" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="办理机构:" prop="" label-width="140px">
                            <el-input v-model="viewsupervisionrecord.createUserUnit" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="11">
                        <el-form-item label="办理时间:" prop="" label-width="140px">
                            <el-date-picker
                                    v-model="viewsupervisionrecord.submitTime"
                                    type="date"
                                    :editable="false"
                                    value-format="yyyy-MM-dd"
                                    placeholder="创建时间"
                                    disabled>
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="监管实体类别:" prop="" label-width="140px">
                            <el-select v-model="viewsupervisionrecord.supervisionType " disabled>
                                <el-option label="检测环境" value="0"></el-option>
                                <el-option label="其他" value="1"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="22">
                        <div style="float:right;">
                            <el-button type="info" size="small" style="width: 60px;height: 30px;"
                                       @click="viewdialogForm = false">关闭
                            </el-button>
                        </div>
                    </el-col>
                </el-row>
            </el-form>
        </div>
    </el-dialog>

    <!--催办-->
    <el-dialog title="" :visible.sync="pressdialogForm" center fullscreen>
        <div style="margin-top: 0px;">
            <el-form :model="presssupervisionrecord" :rules="rules" ref="presssupervisionrecord" label-width="140px">
                <el-row>
                    <el-col :span="8" class="tab-title">
                        监管结果登记详情
                    </el-col>
                </el-row>
                <el-row>
                    <!--2020.7.17：新增以下两个字段-->
                    <el-col :span="11">
                        <el-form-item label="标题:" label-width="140px">
                            <el-input v-model.trim="presssupervisionrecord.supervisionrecord.title" placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="11">
                        <el-form-item label="监管对象名称:" prop="supervisionObjectName" label-width="140px">
                            <el-input v-model.trim="presssupervisionrecord.supervisionrecord.supervisionObjectName" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="项目名称:" prop="" label-width="140px">
                            <el-input v-model="presssupervisionrecord.supervisionrecord.projectName" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="建设位置:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.jianPlace" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="单位名称:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.unitName" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="行政区划:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.administrativeDivision"
                                      placeholder="" disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="工程类型:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.projectType" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="项目类型:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.itemType" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="联系人:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.linkman" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="联系电话:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.linkmanPhone" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="是否影响:" prop="" label-width="140px">
                            <el-select v-model=" presssupervisionrecord.supervisionrecord.isAffect " disabled>
                                <el-option label="是" value="0"></el-option>
                                <el-option label="否" value="1"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="是否办理行政许可:" prop="" label-width="140px">
                            <el-select v-model=" presssupervisionrecord.supervisionrecord.administrativeLicense "
                                       disabled>
                                <el-option label="已办理" value="0"></el-option>
                                <el-option label="未办理" value="1"></el-option>
                                <el-option label="无需办理" value="2"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="经办人:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.createUser" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="办理机构:" prop="" label-width="140px">
                            <el-input v-model=" presssupervisionrecord.supervisionrecord.createUserUnit" placeholder=""
                                      disabled></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="10">
                        <el-form-item label="办理时间:" prop="" label-width="140px">
                            <el-date-picker
                                    v-model=" presssupervisionrecord.supervisionrecord.submitTime"
                                    type="date"
                                    :editable="false"
                                    value-format="yyyy-MM-dd"
                                    placeholder="创建时间"
                                    disabled>
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="监管实体类别:" prop="" label-width="140px">
                            <el-select v-model=" presssupervisionrecord.supervisionrecord.supervisionType " disabled>
                                <el-option label="检测环境" value="0"></el-option>
                                <el-option label="其他" value="1"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="4" class="tab-title">
                        催办信息
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="7">
                        <el-form-item label="催办主题:" prop="press.title" :rules="rules.title" label-width="110px">
                            <el-input v-model="presssupervisionrecord.press.title" placeholder="" style=""></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7">
                        <el-form-item label="催办机构:" prop="press.orgName" :rules="rules.orgName" label-width="110px">
                            <!--<el-select v-model="presssupervisionrecord.press.orgName" placeholder="" style="">
                                <el-option
                                        v-for="item in orgs"
                                        :key="item.appId"
                                        :label="item.dictName"
                                        :value="item.dictName">
                                </el-option>
                            </el-select>-->

                            <el-select v-model="presssupervisionrecord.press.orgName" placeholder="请选择" multiple
                                       collapse-tags @change="selectChange">
                                <el-option :value="mineStatusValue" style="height: auto">
                                    <el-tree :data="orgs" show-checkbox
                                             :expand-on-click-node="false"
                                             check-on-click-node
                                             :default-expand-all="true"
                                             :check-strictly="true"
                                             node-key="id" ref="tree" highlight-current :props="defaultProps"
                                             @check-change="handleCheckChange">
                                    </el-tree>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="22">
                        <el-form-item label="催办内容:" prop="press.content" :rules="rules.content" label-width="110px">
                            <el-input
                                    type="textarea"
                                    :autosize="{ minRows: 8, maxRows: 8}"
                                    placeholder=""
                                    maxlength="500"
                                    show-word-limit
                                    v-model="presssupervisionrecord.press.content">
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="22">
                        <div style="float:right;">
                            <el-button type="primary" size="small" style="width: 60px;height: 30px;"
                                       @click="press('presssupervisionrecord')">催办
                            </el-button>
                            <el-button type="info" size="small" style="width: 60px;height: 30px;"
                                       @click="resetForm('presssupervisionrecord');pressdialogForm = false">取消
                            </el-button>
                        </div>
                    </el-col>
                </el-row>
            </el-form>
        </div>
    </el-dialog>
</div>
<script>
    var vm = new Vue({
        el: '#app',
        data() {
            return {
                orgLevel: '',
                userName: '',
                orgName: '',
                uuid: '',
                link: '',
                orgs: [],
                mineStatusValue: [],
                defaultProps: {
                    children: "children",
                    label: "deptName"
                },
                currentPage: 1, //默认显示页面为1
                pagesize: 10, // 每页的数据条数
                currentPage1: 1,
                pagesize1: 5,
                tableTotal1: '',
                tjdialogForm: false,//统计弹窗
                viewdialogForm: false,//查看详情弹窗
                pressdialogForm: false,//催办弹窗
                tableTotal: '',
                address: [{
                    provinceValue: '',
                    cityValue: '',
                    areaValue: '',
                    provinceData: [],
                    cityData: [],
                    areaData: []
                }],
                selectForm: {
                    projectName: '',
                    administrativeDivision: '',
                    createUser: '',
                    createUserUnit: '',
                    startTime: '',
                    endTime: '',
                    status: '',
                    supervisionType: '',
                    unitName: ''
                },
                Form: {
                    projectName: '',
                    administrativeDivision: '',
                    createUser: '',
                    createUserUnit: '',
                    startTime: '',
                    endTime: '',
                    status: '',
                    supervisionType: '',
                    unitName: ''
                },
                supervisionrecord: {
                    title: '',
                    createUser: '',
                    createUserUnit: '',
                    createTime: '',
                    supervisionObjectName: '',
                    supervisionType: '',
                    supervisionRecordContent: 'AA',
                    status: ''
                },
                viewsupervisionrecord: {
                    // 标题
                    title: '',
                    // 监管对象名称
                    supervisionObjectName: '',
                    projectName: '',
                    jianPlace: '',
                    unitName: '',
                    administrativeDivision: '',
                    projectType: '',
                    itemType: '',
                    linkman: '',
                    linkmanPhone: '',
                    isAffect: '',
                    administrativeLicense: '',
                    createUser: '',
                    createUserUnit: '',
                    submitTime: '',
                    supervisionType: '',
                    createTime: '',
                },
                presssupervisionrecord: {
                    supervisionrecord: {
                        // 标题
                        title: '',
                        // 监管对象名称
                        supervisionObjectName: '',
                        projectName: '',
                        jianPlace: '',
                        unitName: '',
                        administrativeDivision: '',
                        projectType: '',
                        itemType: '',
                        linkman: '',
                        linkmanPhone: '',
                        isAffect: '',
                        administrativeLicense: '',
                        createUser: '',
                        createUserUnit: '',
                        submitTime: '',
                        supervisionType: '',
                        createTime: '',
                    },
                    press: {
                        linkId: '',
                        title: '',
                        orgName: '',
                        content: ''
                    }
                },
                xData: [],
                yData: [],
                dialogFormVisible: false,
                currentRow: null,
                rules: {
                    title: [{
                        required: true,
                        message: '请输入标题',
                        trigger: 'blur'
                    }, {
                        validator: trimIsEmpty,
                        message: '填写标题',
                        trigger: 'blur'
                    }, {
                        min: 1,
                        max: 50,
                        message: '长度在 1 到 50个字符'
                    }],
                    createUser: [{
                        required: true,
                        message: '请输入创建人',
                        trigger: 'blur'
                    }],
                    createUserUnit: [{
                        required: true,
                        message: '请输入创建单位',
                        trigger: 'blur'
                    }],
                    createTime: [{
                        required: true,
                        message: '请选择日期',
                        trigger: 'change'
                    }],
                    supervisionRecordContent: [{
                        required: true,
                        message: '请输入监管情况记录',
                        trigger: 'blur'
                    }],
                    supervisionType: [{
                        required: true,
                        message: '请选择监管对象类别',
                        trigger: 'change'
                    }],
                    orgName: [{
                        required: true,
                        message: '必填',
                        trigger: 'blur'
                    }],
                    content: [{
                        required: true,
                        message: '必填',
                        trigger: 'blur'
                    }, {
                        validator: trimIsEmpty,
                        message: '填写催办内容',
                        trigger: 'blur'
                    }, {
                        min: 1,
                        max: 300,
                        message: '长度在 1 到 300个字符'
                    }]
                }
            }

        },
        created() {
            // 获取登录用户信息
            var userInfo = JSON.parse(localStorage.getItem('userInfo'));
            this.orgLevel = userInfo.orgLevel;
            // 中国地震局 ==> 中国, 山东省-济南市地震局 ==> 山东省-济南市
            this.orgName = userInfo.orgName.replace("地震局", "");
            this.userName = userInfo.loginName;

            //机构
            axios.get('/dzjjcss/org/getOrg').then(res => {
                debugger;
                console.log(res.data);
                orgData = JSON.parse(res.data.data);
                this.orgs = orgData;
            }).catch(e => {
                this.$message.error("网络连接超时");
            })
        },
        mounted() {
            this.getData();

        },
        methods: {
            getData() {
                axios({
                    method: 'get',
                    url: '/dzjjcss/statistics/getPage',
                    params: {
                        projectName: this.Form.projectName.trim(),
                        administrativeDivision: this.Form.administrativeDivision.trim(),
                        supervisionType: this.Form.supervisionType,
                        createUser: this.Form.createUser.trim(),
                        unitName: this.Form.unitName.trim(),
                        createUserUnit: this.Form.createUserUnit,
                        status: this.Form.status,
                        startTime: this.Form.startTime,
                        endTime: this.Form.endTime,
                        pageSize: this.pagesize,
                        pageNo: this.currentPage
                    }
                })
                    .then(response => {
                        console.log(response)
                        if (response.data.code == 200) {
                            console.log(response.data.data.results)
                            this.supervisionrecord = response.data.data.results;
                            this.tableTotal = response.data.data.total;
                        } else {
                            this.$message.error(response.data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            searchForm() {
                this.Form = this.selectForm;
                this.currentPage = 1;
                axios({
                    method: 'get',
                    url: '/dzjjcss/statistics/getPage',
                    params: {
                        projectName: this.Form.projectName.trim(),
                        administrativeDivision: this.Form.administrativeDivision.trim(),
                        supervisionType: this.Form.supervisionType,
                        createUser: this.Form.createUser.trim(),
                        unitName: this.Form.unitName.trim(),
                        createUserUnit: this.Form.createUserUnit,
                        status: this.Form.status,
                        startTime: this.Form.startTime,
                        endTime: this.Form.endTime,
                        pageSize: this.pagesize,
                        pageNo: this.currentPage
                    }
                })
                    .then(response => {
                        console.log(response)
                        if (response.data.code == 200) {
                            console.log(response.data.data.results)
                            this.supervisionrecord = response.data.data.results;
                            this.tableTotal = response.data.data.total;
                        } else {
                            this.$message.error(response.data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            /* 单选搜索表单 */
            selectCurrentChange(val) {
                this.currentRow = val;
            },
            //点击第几页
            handleCurrentChange1(currentPage) {
                this.currentPage1 = currentPage;
                this.onSearch();
            },
            //重置
            resetForm1(formName) {
                this.Form.projectName = '';
                this.Form.createUser = '';
                this.Form.createUserUnit = '';
                this.Form.status = '';
                this.Form.startTime = '';
                this.Form.endTime = '';
                this.Form.administrativeDivision = '';
                this.Form.supervisionType = '';
                this.Form.unitName = '';
                this.selectForm.projectName = '';
                this.selectForm.createUser = '';
                this.selectForm.createUserUnit = '';
                this.selectForm.status = '';
                this.selectForm.startTime = '';
                this.selectForm.endTime = '';
                this.selectForm.administrativeDivision = '';
                this.selectForm.supervisionType = '';
                this.selectForm.unitName = '';
                this.getData();
            },
            changeval() {
                if (this.selectForm.endTime != '') {
                    if (this.selectForm.startTime > this.selectForm.endTime) {
                        this.$message.error("办理开始时间必须小于办理结束日期");
                        return;
                    }
                }
                if (this.selectForm.startTime != '' && this.selectForm.endTime != '') {
                    if (this.selectForm.startTime > this.selectForm.endTime) {
                        this.$message.error("办理开始时间必须小于办理结束日期");
                        return;
                    }
                }

            },
            //取消
            resetForm(formName) {
                this.$refs[formName].resetFields();
            },
            //每页下拉显示数据
            handleSizeChange: function (size) {
                this.pagesize = size;
                this.getData();
            },
            //点击第几页
            handleCurrentChange: function (currentPage) {
                this.currentPage = currentPage;
                this.getData();
            },
            //select框值改变时候触发的事件
            selectChange(e) {
                var arrNew = [];
                var dataLength = this.mineStatusValue.length;
                var eleng = e.length;
                for (let i = 0; i < dataLength; i++) {
                    for (let j = 0; j < eleng; j++) {
                        if (e[j] === this.mineStatusValue[i].label) {
                            arrNew.push(this.mineStatusValue[i])
                        }
                    }
                }
                this.$refs.tree.setCheckedNodes(arrNew);//设置勾选的值
            },
            // 多选
            handleCheckChange() {
                let res = this.$refs.tree.getCheckedNodes(false, true); //这里两个true，1. 是否只是叶子节点 2. 是否包含半选节点（就是使得选择的时候不包含父节点）
                let arrLabel = [];
                let arr = [];
                res.forEach(item => {
                    arrLabel.push(item.deptName);
                    arr.push(item);
                });
                this.mineStatusValue = arr;
                this.presssupervisionrecord.press.orgName = arrLabel;
            },
            // 单选
            handleCheckChangeOnce(data, checked, node) {
                debugger;
                console.log(data);
                //这里两个true，1. 是否只是叶子节点 2. 是否包含半选节点（就是使得选择的时候不包含父节点）
                let res = this.$refs.tree.getCheckedNodes(false, true);
                if (checked === true) {
                    this.selectForm.createUserUnit = data.deptName;
                    this.$refs.tree.setCheckedNodes([data]);
                } else {
                    if (this.selectForm.createUserUnit == data.deptName) {
                        this.$refs.tree.setCheckedNodes([data]);
                    }
                }
                /*let arrLabel = [];
                let arr = [];
                res.forEach(item => {
                    arrLabel.push(item.deptName);
                    arr.push(item);
                });
                this.mineStatusValue = arr;
                this.mailbox.supervisionUnitName = arrLabel;*/
            },

            // 统计
            tongji() {
                this.tjdialogForm = true;
                this.$nextTick(() => {
                    axios({
                        method: 'get',
                        url: appBaseUrl + '/statistics/statistical',
                    })
                        .then(response => {
                            console.log(response)
                            if (response.data.code == 200) {
                                this.xData = response.data.data[0];
                                this.yData = response.data.data[1];
                                this.zzt();
                            } else {
                                this.$message.error(response.data.msg);
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });

                })
            },
            // 柱状图
            zzt() {
                var myChart = echarts.init(document.getElementById('echarts3'));
                option = {
                    color: ['#3398DB'],
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                        }
                    },
                    grid: {
                        left: '3%',
                        right: '4%',
                        bottom: '3%',
                        containLabel: true
                    },
                    xAxis: [
                        {
                            type: 'category',
                            data: this.xData,
                            axisTick: {
                                alignWithLabel: true
                            }
                        }
                    ],
                    yAxis: [
                        {
                            type: 'value'
                        }
                    ],
                    series: [
                        {
                            name: '调查数据量',
                            type: 'bar',
                            barWidth: '20%',
                            data: this.yData,
                            label: {
                                show: true,
                                position: 'top',
                                color: "#000",
                                formatter: '{c}'
                            }
                        }
                    ]
                };
//              //根据屏幕尺寸大小图表自适应
//              window.onresize = function() {
//                  myChart.resize();
//              };
                myChart.setOption(option);
            },

            //导出
            appovalEx() {
                this.$confirm('确定要导出吗?', '提示', {
                    cancelButtonText: '取消',
                    confirmButtonText: '确定',
                    type: 'warning'
                }).then(() => {
                    window.location.href = appBaseUrl + "/statistics/export?projectName=" + this.selectForm.projectName + "&administrativeDivision="
                        + this.selectForm.administrativeDivision + "&createUser="
                        + this.selectForm.createUser + "&createUserUnit="
                        + this.selectForm.createUserUnit + "&startTime="
                        + this.selectForm.startTime + "&endTime="
                        + this.selectForm.endTime + "&status="
                        + this.selectForm.status + "&supervisionType="
                        + this.selectForm.supervisionType + "&unitName="
                        + this.selectForm.unitName;
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消导出'
                    });
                });
            },
            view(index, row) {
                this.uuid = row.id;
                this.link = "../upload/annex.html?uuid=" + this.uuid + "&flag=0";
                this.viewdialogForm = true;
                this.viewsupervisionrecord = row;
            },
            // 点击进入催办
            cuiban(index, row) {
                this.uuid = row.id;
                this.link = "../upload/annex.html?uuid=" + this.uuid + "&flag=0";
                this.pressdialogForm = true;
                console.log(row);
                this.presssupervisionrecord.supervisionrecord = row;
            },
            // 催办提交
            press(formName) {
                debugger;
                console.log(this.presssupervisionrecord);
                this.presssupervisionrecord.press.orgName = this.presssupervisionrecord.press.orgName.toString();
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.presssupervisionrecord.press.linkId = this.presssupervisionrecord.supervisionrecord.id;
                        axios({
                            method: 'post',
                            url: appBaseUrl + '/statistics/urge',
                            // data中必须有id
                            data: this.presssupervisionrecord.press
                        }).then((res) => {
                            console.log(res);
                            if (res.data.code == 200) {
                                // 提交成功将要执行的代码
                                this.getData();
                                this.$message({
                                    message: '催办成功',
                                    type: 'success'
                                });
                                this.pressdialogForm = false;
                            }
                        });
                    } else {
                        console.log("error!!");
                        return false;
                    }
                });
            },
            // 操作按钮的提交
            submit(index, row) {
                this.$confirm('确定要提交吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    axios({
                        method: 'get',
                        url: '/dzjdzqs/supervision/submit',
                        params: {
                            id: row.id
                        }
                    }).then((res) => {
                        console.log(res.data);
                        if (res.data.code == 200) {
                            // 提交成功将要执行的代码
                            console.log(res.data.msg);
                            this.getData();
                            this.$message({
                                type: 'success',
                                message: '提交成功!'
                            });
                        }
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消提交'
                    });
                });
            },
            // 删除
            del(index, row) {
                var pagesize = this.pagesize;
                var pageno = this.currentPage;
                var afterPage = Math.floor(this.tableTotal / pagesize);
                var nowSize = this.tableTotal % pagesize;
                this.$confirm('确定要删除吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    axios({
                        method: 'post',
                        url: '/dzjdzqs/supervision/delete/' + row.id,
                    }).then((res) => {
                        console.log(res);
                        if (res.data.code == 200) {
                            this.supervisionrecord.splice(index, 1);
                            this.$message({
                                type: 'success',
                                message: '删除成功!'
                            });
                            if (nowSize == '1' && afterPage >= '0') {
                                this.currentPage = afterPage;
                                this.getData();
                            } else {
                                this.getData();
                            }
                        }
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消删除'
                    });
                });
            },
            // 上报
            report(index, row) {
                this.$confirm('确定要上报吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    axios({
                        method: 'post',
                        url: '/dzjap/regionrecord/report/' + row.recordId,
                        data: row
                    }).then((res) => {
                        console.log(res.data);
                        if (res.data.code == 200) {
                            // 提交成功将要执行的代码
                            console.log(res.data.msg);
                            this.getData();
                            this.$message({
                                type: 'success',
                                message: '已上报!'
                            });
                        }
                    });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '取消上报'
                    });
                });
            },
            // 审核
            check(index, row) {
                this.uuid = row.recordId;
                this.link = "../upload/annex.html?uuid=" + this.uuid + "&flag=0";
                this.checkdialogForm = true;
                this.checksupervisionrecord = row;
            },
            clearForm() {
                this.gonggao.title = ''; // 拟制公告标题
                this.gonggao.relationId = '';
                this.gonggao.publicState = '';
                this.gonggao.publicType = '';
                this.gonggao.attachContent = '';
            },
            // 拟制公告
            gongGao(index, row) {
                this.dialogGongGaoForm = true;
                this.viewsupervisionrecord = row;
                this.getUuid();
            },
            viewgongGao(index, row) {
                this.dialogGongGaoViewForm = true;
                axios({
                    method: 'get',
                    url: '/dzjap/publick/getGlPublick',
                    params: {
                        relationId: row.recordId
                    }
                })
                    .then(response => {
                        let data = response.data;
                        if (data.code == 200) {
                            let rowdata = response.data.data;
                            this.clearForm(); // 重置
                            this.uuid = response.data.data.publicId;
                            this.link = "../upload/annex.html?uuid=" + this.uuid + "&flag=0";
                            this.gonggao = rowdata;
                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            // 拟制公告--发布
            release() {
                this.gonggao.relationId = this.viewsupervisionrecord.recordId;
                this.gonggao.publicId = this.uuid;
                this.gonggao.attachContent = this.gonggao.attachContent.replace(/[\n\r]/g, '<br/>');
                axios({
                    method: 'post',
                    url: '/dzjap/regionrecord/addHandle',
                    data: this.gonggao
                })
                    .then(response => {
                        console.log(response);
                        if (response.data.code == 200) {
                            // 拟制公告--发布成功
                            this.getData();
                            this.$message({
                                type: 'success',
                                message: '拟制公告发布成功!'
                            });
                            this.dialogGongGaoForm = false;
                            this.clearForm(); // 重置

                        } else {
                            this.$message.error(data.msg);
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            addAddress() {
                axios.get('../../json/ChinaCity.json').then(res => {
                    this.address.forEach((item, index) => {
                        item.provinceData = res.data;
                    })
                }).catch(e => {
                    this.$message.error("网络连接超时");
                })
                this.address.push({
                    provinceValue: '',
                    cityValue: '',
                    areaValue: '',
                    provinceData: [],
                    cityData: [],
                    areaData: [],
                })
            },
            delAddress(index, item) {
                this.address.splice(index, 1);
            },
            chooseProvince(item) {
                console.log(item)
                console.log(item.provinceValue)
                item.cityValue = '';
                item.areaValue = '';
                this.newcityValue = '';
                this.newareaValue = '';
                item.cityData = [];
                item.areaData = [];
                item.provinceData.map(e => {//遍历数据
                    if (item.provinceValue == e.name) {
                        item.cityData = e.cityList;
                        return;
                    }
                })
                this.newprovinceValue = item.provinceValue;
            },
            chooseCity(item) {
                console.log(item)
                console.log(item.cityValue)
                item.areaValue = '';
                this.newareaValue = '';
                item.cityData.map(e => {//遍历数据
                    if (item.cityValue == e.name) {
                        item.areaData = e.areaList;
                        return;
                    }
                })
                this.newcityValue = item.cityValue;

            },
            chooseArea(item) {
                console.log(item)
                console.log(item.areaValue)
                console.log(this.address)
            },
            changeValuetype(value) {
                console.log(value)
                if (value == '0' || value == '3') {
                    this.LandType = '0';
                } else {
                    this.LandType = '1';
                }
            },
            // 验证字符串是否电话号
            checkTel(str) {
                let re = /^\d{3}-\d{8}|\d{4}-\d{7}$/;
                if (re.test(str)) {
                    return true;
                } else {
                    return false;
                }
            },
            //验证非负浮点数值
            checkNum(str) {
                let re = /^\d+(\.\d+)?$/;
                if (re.test(str)) {
                    return true;
                } else {
                    return false;
                }
            },
            //验证营业执照或证件三合一
            checkCard(str) {
                let re = /(^(?:(?![IOZSV])[\dA-Z]){2}\d{6}(?:(?![IOZSV])[\dA-Z]){10}$)|(^\d{15}$)/;
                if (re.test(str)) {
                    return true;
                } else {
                    return false;
                }
            }
        }
    })
</script>
</body>
</html>